import { useState } from 'react'
import reactLogo from './assets/react.svg'
import viteLogo from '/vite.svg'
import './App.css'
import { useSelector,useDispatch } from 'react-redux'
import { fetchChannels } from './store/modules/counter'
import { useEffect } from 'react'
import Zhuti from "./computed/zhuti";
function App() {
  const {channelList} =  useSelector((state)=>{
  console.log(state.counterReducer)
  return state.counterReducer
 })
 const dispatch = useDispatch()

  useEffect(()=>{
    dispatch(fetchChannels())
  },[dispatch])

  return (
    <div>
      <Zhuti />
      <table>
          <tbody>
            <tr>
              <td>id</td>
              <td>标题</td>
              <td>内容</td>
              <td>创建时间</td>
            </tr>
            {channelList.map(item=>(
              <tr key={item.id}>
                <td>{item.id}</td>
                <td>{item.title}</td>
                <td>{item.content}</td>
                <td>{item.createdAt}</td>
              </tr>
            )
            )}
          </tbody>
        </table>
    </div>
  )
}

export default App
